<script setup lang="ts">
import { reactive } from 'vue'

const state = reactive({
    visible: false,
    form: {}
})

const open = () => {
    state.visible = true
}

defineExpose({
    open
})
</script>

<template>
    <a-modal
        v-model:visible="state.visible"
        :mask-closable="false"
        :esc-to-close="false"
        title-align="start"
        title="条件查询"
        width="800px"
    >
        <a-form :model="state.form" auto-label-width>
            <a-grid :cols="2" :row-gap="0" :col-gap="20">
                <a-grid-item>
                    <a-form-item label="仓库名" field="">
                        <a-input placeholder="请输入仓库名称" />
                    </a-form-item>
                </a-grid-item>
                <a-grid-item>
                    <a-form-item label="仓库域名" field="">
                        <a-input placeholder="请输入">
                            <template #prepend>https://</template>
                            <template #append>.com</template>
                        </a-input>
                    </a-form-item>
                </a-grid-item>
                <a-grid-item>
                    <a-form-item label="仓库管理员" field="">
                        <a-select placeholder="请选择管理员">
                            <a-option>付晓晓</a-option>
                            <a-option>周毛毛</a-option>
                        </a-select>
                    </a-form-item>
                </a-grid-item>
            </a-grid>
        </a-form>
    </a-modal>
</template>
